<!-- 收藏 -->
<template>
	<view>
		<uni-nav-bar dark :fixed="true" shadow background-color="#fff" status-bar left-icon="left" left-text="" title="关注的商品" @clickLeft="back" />
		<view class="main-collect">
			<view class="collect-item" v-for="(item, index) in state.data" :key="index">
				<image :src="item.cover_img" mode=""></image>
				<view class="desc">
					<view class="title">
						{{item.title}}
					</view>
					<view class="time">
						{{item.create_time}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
import { reactive, onMounted } from "vue";
import { myCollect } from '@/request/api/my.js';
const state = reactive({
	data: []
})

onMounted(() => {
	getData();
})

// 首页信息
const getData = async () => {
	try {
		const resultData = await myCollect();
		state.data = resultData.data.data;
	} catch (e) { }
}

const back = () => {
	uni.navigateBack({
		delta: 1
	})
}
</script>

<style lang="scss" scoped>
	.main-collect {
		.collect-item {
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1rpx solid #E5E4E4;
			padding: 24rpx;
			box-sizing: border-box;
			margin: 0rpx 24rpx;
			image {
				width: 144rpx;
				height: 144rpx;
				border-radius: 20rpx;
			}
			.desc {
				flex: 1;
				margin-left: 36rpx;
				font-size: 26rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #1C1919;
				line-height: 40rpx;
				.title {}
				.time {
					margin-top: 20rpx;
				}
			}
		}
	}
</style>